<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;}
        #contentditu { 
			    position: absolute;
			    left:100px;
			    top:15px;
			    z-index: 2;
			    pointer-events: auto;
			    width: 300px;
			    float: left;
			    box-sizing: border-box;
			    box-shadow: 1px 2px 1px rgba(0,0,0,.15);
			}
			#keyword {
				box-sizing: border-box;
				border: 0;
				padding: 9px 8px;
				line-height: 20px;
				font-size: 16px;
				height: 38px;
				color: #333;
				position: relative;
				border-radius: 2px 0 0 2px;
				width: 100%;
			}
    </style>
    <script src="/js/jquery-2.1.4.min.js"></script>

	<script src="http://webapi.amap.com/maps?v=1.3&key=5f6a1f79934bc39bdf25c0907b320d58&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>
</head>

<body>
	<div id="contentditu">
		<input type="text" id="keyword" placeholder="请输入地址"  />
		<!--<div id="searchResultPanel" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;">
		</div>-->
	</div>
    <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
	var map = new AMap.Map('allmap', {
		resizeEnable: true,
		zoom:11,
		center: [113.394277, 23.052381]
	});
    //加载IP定位插件
    map.plugin(["AMap.CitySearch"], function() {        //实例化城市查询类
        //实例化城市查询类
        var citysearch = new AMap.CitySearch();
        //自动获取用户IP，返回当前城市
        citysearch.getLocalCity(function(status, result) {
            if (status === 'complete' && result.info === 'OK') {
                if (result && result.city && result.bounds) {
                    //var cityinfo = result.city;
                    var citybounds = result.bounds;
                    //地图显示当前城市
                    map.setBounds(citybounds);
                }
            }
        });
    });
    var geocoder = null;
    AMap.service('AMap.Geocoder',function(){//回调函数
        //实例化Geocoder
        geocoder = new AMap.Geocoder({
            city: ""//城市，默认：“全国”
        });
        //TODO: 使用geocoder 对象完成相关功能
    })

    //加载输入提示插件
	map.plugin(["AMap.ToolBar"],function(){
		//加载工具条
		var tool = new AMap.ToolBar();
		map.addControl(tool);
	});


	//输入提示
	var autoOptions = {
		input: "keyword"
	};
	var auto = new AMap.Autocomplete(autoOptions);
	var placeSearch = new AMap.PlaceSearch({
		map: map
	});  //构造地点查询类
	AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
	function select(e) {
		placeSearch.setCity(e.poi.adcode);
		placeSearch.search(e.poi.name);  //关键字查询查询
	}

	//点击地图获取座标等
	var _onClick = function(e){




        map.clearMap();
		var icon = new AMap.Icon({
			image : 'http://webapi.amap.com/theme/v1.3/markers/n/mark_r.png',//24px*24px
			//icon可缺省，缺省时为默认的蓝色水滴图标，
		});
		var marker = new AMap.Marker({
			icon : icon,//24px*24px
			position : e.lnglat,
			animation:'AMAP_ANIMATION_BOUNCE',
			map : map
		});
        //逆地理编码
        var lnglatXY=[e.lnglat.I, e.lnglat.L];//地图上所标点的坐标
        geocoder.getAddress(lnglatXY, function(status, result) {
            if (status === 'complete' && result.info === 'OK') {
                //获得了有效的地址信息:
                $('.jeBox-header', parent.document).text(result.regeocode.formattedAddress);
                parent.city = result.regeocode.addressComponent.city;
                parent.address =  result.regeocode.formattedAddress;
                parent.latitude =  e.lnglat.I;
                parent.longtitude =  e.lnglat.L;
            }else{
                //获取地址失败
            }
        });
	};
	map.on('click', _onClick);//绑定







</script>